<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>鑫喜钻</title>
    <link rel="stylesheet" href="./index.css">
</head>
<body>
    <!-- 导航栏上方部分 -->
    <div class="navtop">
        <div>
            <div>
                <img src="./images/logo.png" alt="">
            </div>
            <div>
                <p>比利时钻石顶尖知名品牌<br>2016年幸福传递大使</p>
            </div>
        </div>
        <div>
            <div>
                <a href="#">
                    <p>收藏网站</p>
                </a>
                <a href="#">
                    <p>设为首页</p>
                </a>
                <a href="#">
                    <p>联系我们</p>
                </a>
            </div>
            <div><img src="./images/tel.jpg" alt=""></div>
            <div><a href="#">裸钻定制快速通道></a></div>
        </div>
    </div>
    <!-- 导航栏 -->
    <div class="nav">
        <ul>
            <li><a href="#">鑫喜钻首页</a></li>
            <li>
                <a href="#">裸钻定制</a>
                <ul>
                    <li>
                        <div class="transparent">
                            <div>
                                <img src="./images/W020130723573926673807_100.png" alt="">
                                <p>智能电视</p>
                            </div>
                            <div>
                                <img src="./images/W020130801393613513132_100.png" alt="">
                                <p>3D电视</p>
                            </div>
                            <div>
                                <img src="./images/W020130801375422178789_100.png" alt="">
                                <p>LED电视</p>
                            </div>
                            <!-- 空盒子把客服电话挤下去 -->
                            <div></div>
                            <div>
                                <img src="./images/r_i_img.gif" alt=""><span>&emsp;客服热线: 4006 111 111</span>
                            </div>
                        </div>
                    </li>
                </ul>
            </li>
            <li><a href="#">结婚钻戒</a></li>
            <li><a href="#">情侣钻戒</a></li>
            <li><a href="#">礼物/配饰</a></li>
            <li><a href="#">外来宝石加工</a></li>
            <li><a href="#">品牌体验店</a></li>
            <li><a href="#">最新活动</a></li>
            <li><a href="#">买家秀</a></li>
            <li><a href="#">积分兑换</a></li>
        </ul>
    </div>
    <!-- 轮播图 -->
    <div class="zt">
        <div class="zt1">
            <img src="./images/img_main_1.jpg" alt="">
            <img src="./images/img_main_2.jpg" alt="">
            <img src="./images/img_main_3.jpg" alt="">
            <img src="./images/img_main_4.jpg" alt="">
            <img src="./images/img_main_5.jpg" alt="">
            <img src="./images/img_main_1.jpg" alt="">
        </div>
    </div>
    <!-- 新品特价 -->
    <div class="newArrival">
        <p>新品特价<br>NEW&emsp;ARRIVAL</p>
    </div>
    <!-- 新品特价下方图片 -->
    <div class="newArrivalbottomimg">
        <div><span>
                <p>想知道我们都有什么服务？</p>
                <p>这里有你想要的答案！</p>
            </span>
            <div class="zzc1"></div><img src="./images/1383541695.jpg" alt="">
        </div>
        <div><span>
                <p>您想要了解资海吗？</p>
                <p>让我带您了解我们的优势！</p>
            </span>
            <div class="zzc2"></div><img src="./images/1383536386.jpg" alt="">
        </div>
        <div><span>
                <p>给您一个惊喜,进入我们的世界！</p>
                <p>终有一个是您想要的！</p>
            </span>
            <div class="zzc3"></div><img src="./images/1383540866.jpg" alt="">
        </div>
        <div>
            <span>
                <p>走进我们的世界</p>
                <p>为您提供最专业、最优质的服务！</p>
            </span>
            <div class="zzc4"></div><img src="./images/1383541808.jpg" alt="">
        </div>
    </div>
    <!-- 产品分类 -->
    <div class="PRODUCT">
        <img src="./images/gggg2.jpg" alt="">
        <img src="./images/ttttc4.jpg" alt="">
    </div>
    <!-- 产品分类下方导航栏 -->
    <div class="nav2">
        <ul>
            <li>价格区域</li>
            <li>钻石分类</li>
            <li>钻石形状</li>
            <li>钻石饰品</li>
            <li>钻石形状</li>
        </ul>
    </div>
    <!-- 商品图片介绍部分 -->
    <div class="f">
        <div>
            <img src="./images/t2.jpg" alt="">
            <div class="fTextbox">
                <p>白金单钻钻戒&nbsp;戒托</p>
                <span class="textspan">
                    <span>RMB:</span><span>899起</span>
                </span>
            </div>
        </div>
        <div>
            <img src="./images/8.jpg" alt="">
            <div class="fTextbox">
                <p>白金单钻钻戒&nbsp;戒托</p>
                <span class="textspan">
                    <span>RMB:</span><span>899起</span>
                </span>
            </div>
        </div>
        <div>
            <img src="./images/9.jpg" alt="">
            <div class="fTextbox">
                <p>白金单钻钻戒&nbsp;戒托</p>
                <span class="textspan">
                    <span>RMB:</span><span>899起</span>
                </span>
            </div>
        </div>
        <div>
            <img src="./images/10.jpg" alt="">
            <div class="fTextbox">
                <p>白金单钻钻戒&nbsp;戒托</p>
                <span class="textspan">
                    <span>RMB:</span><span>899起</span>
                </span>
            </div>
        </div>
        <div>
            <img src="./images/11.jpg" alt="">
            <div class="fTextbox">
                <p>白金单钻钻戒&nbsp;戒托</p>
                <span class="textspan">
                    <span>RMB:</span><span>899起</span>
                </span>
            </div>
        </div>
        <div>
            <img src="./images/12.jpg" alt="">
            <div class="fTextbox">
                <p>白金单钻钻戒&nbsp;戒托</p>
                <span class="textspan">
                    <span>RMB:</span><span>899起</span>
                </span>
            </div>
        </div>
        <div>
            <img src="./images/13.jpg" alt="">
            <div class="fTextbox">
                <p>白金单钻钻戒&nbsp;戒托</p>
                <span class="textspan">
                    <span>RMB:</span><span>899起</span>
                </span>
            </div>
        </div>
        <div>
            <img src="./images/14.jpg" alt="">
            <div class="fTextbox">
                <p>白金单钻钻戒&nbsp;戒托</p>
                <span class="textspan">
                    <span>RMB:</span><span>899起</span>
                </span>
            </div>
        </div>
    </div>
    <!-- 鑫喜钻大logo -->
    <div class="logo">
        <hr><img src="./images/nnnn3.jpg" alt="">
    </div>
    <!-- 下方五张动画图片盒子 -->
    <div class="bottomImgBox">
        <div>
            <div>
                <span>公主方钻定制</span>
                <img src="./images/tu5.jpg" alt="">
            </div>
            <div>
                <span>公主方钻定制</span>
                <img src="./images/tu4.jpg" alt="">
            </div>
        </div>
        <div>
            <img src="./images/tu3.jpg" alt="">
        </div>
        <div>
            <div>
                <span>枕形钻戒定制</span>
                <img src="./images/tu1.jpg" alt="">
            </div>
            <div>
                <span>公主方钻定制</span>
                <img src="./images/tu2.jpg" alt="">
            </div>
        </div>
    </div>
    <!-- 最下方的图片 -->
    <div class="lastImgBox">
        <img src="./images/wwp2.jpg" alt="">
    </div>
</body>

</html>